<!--
 * @Author: AllenYe
 * @Date: 2021-04-18 09:33:00
 * @LastEditors: AllenYe
 * @LastEditTime: 2021-04-18 16:36:48
 * @Description: file content
-->
<template>
  <div>
      <h2>child 2</h2>
      <button @click="clickBus">child2 pushData</button>
      <!-- 事件总线
      任意两个组件之间传值常用事件总线 或 vuex的方式。 -->
      <!-- $attrs的使用 -->
      <div>{{$attrs.foo}}</div>
      <!-- provide跟inject的使用 -->
      <div>{{data}}</div>
      <input v-model="$attrs.foo" @change="changeValue"/><br>
      <button @click="changeParent">改变父组件里面对的foo的值</button>
  </div>
</template>

<script>
export default {
  inject:['data'],
  data() {
    return {
      name:'child2'
    }
  },
  methods: {
    // input值改变
    changeValue(e){
      this.$emit('input',e.target.value)
    },
    // 总线
    clickBus(){
      // console.log('clickBus')
      // this.$bus.$emit('foo','chlid2 的值')
      console.log('this.$parent')
      this.$parent.$emit('foo','child2')
    },
    // 改变父组件里面的值
    changeParent(){
      this.$parent.dataFoo = "我的值改变了"
    }
  },
}
</script>

<style>

</style>
